<template>
  <el-breadcrumb separator-icon="ArrowRight">
    <!-- <el-breadcrumb-item v-for="item in matched" :key="item.path">
      <router-link v-if="item.path" :to="{ path: item.path }">{{ item.meta.title }}</router-link>
      <span v-else>{{ item.meta.title }}</span>
    </el-breadcrumb-item> -->
    <template v-for="item in route.matched" :key="item.path">
      <el-breadcrumb-item :to="{ path: item.path }" v-if="item.meta?.title">
        <el-icon>
          <component :is="item.meta?.icon" />
        </el-icon>
        {{ item.meta.title }}
      </el-breadcrumb-item>
    </template>
    <!-- <el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
    <el-breadcrumb-item>文章管理</el-breadcrumb-item>
    <el-breadcrumb-item>promotion detail</el-breadcrumb-item> -->
  </el-breadcrumb>
</template>
<script setup lang="ts">
  const route = useRoute()
</script>
<style lang="scss" scoped></style>
